<template>
  <div class="page-container">
    <h1>序列处理</h1>
    <el-form :model="form" label-position="top">
      <el-form-item label="序号分隔符">
        <el-input v-model.trim="form.delimiter" placeholder="请输入序号分隔符"></el-input>
      </el-form-item>
      <el-form-item label="待处理文本">
        <el-input v-model.trim="form.text" type="textarea" placeholder="请输入待处理文本"></el-input>
      </el-form-item>
      <el-form-item label="操作类型">
        <el-radio-group v-model="form.operation">
          <el-radio-button label="add">添加序号</el-radio-button>
          <el-radio-button label="remove">移除序号</el-radio-button>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="form.operation === 'add'" label="序号类型">
        <el-radio-group v-model="form.numberType">
          <el-radio-button label="numeric">数字</el-radio-button>
          <el-radio-button label="chinese">中文</el-radio-button>
        </el-radio-group>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="execute">执行</el-button>
        <el-button @click="resetForm">重置</el-button>
      </el-form-item>
    </el-form>
    <el-form label-position="top">
      <el-form-item label="结果">
        <el-input v-model="resultText" type="textarea" :rows="4"></el-input>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: {
        delimiter: "",
        text: "",
        operation: "add",
        numberType: "numeric",
      },
      resultText: "",
    };
  },
  methods: {
    execute() {
      const delimiter = this.form.delimiter;
      const text = this.form.text;
      const operation = this.form.operation;

      if (!delimiter) {
        this.$message.error("请输入序号分隔符！");
        return;
      }

      if (!text) {
        this.$message.error("请输入待处理文本！");
        return;
      }

      let result;
      if (operation === "add") {
        const numberType = this.form.numberType;
        result = this.addSequentialNumbers(text, delimiter, numberType);
      } else {
        result = this.removeSequentialNumbers(text, delimiter);
      }

      this.resultText = result;
    },
    addSequentialNumbers(text, delimiter, numberType) {
      const lines = text.split("\n");
      let result = "";
      for (let i = 0; i < lines.length; i++) {
        let number;
        if (numberType === "numeric") {
          number = i + 1;
        } else {
          number = this.toChineseNumber(i + 1);
        }
        result += `${number}${delimiter}${lines[i]}\n`;
      }
      return result.trim();
    },
    removeSequentialNumbers(text, delimiter) {
      const lines = text.split("\n");
      let result = "";
      for (let i = 0; i < lines.length; i++) {
        const line = lines[i].trim();
        const index = line.indexOf(delimiter);
        if (index !== -1) {
          result += line.slice(index + delimiter.length).trim() + "\n";
        } else {
          result += line + "\n";
        }
      }
      return result.trim();
    },
    toChineseNumber(number) {
      const chineseNumbers = ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十"];
      if (number <= 10) {
        return chineseNumbers[number - 1];
      } else {
        return number.toString();
      }
    },
    resetForm() {
      this.form.delimiter = "";
      this.form.text = "";
      this.form.operation = "add";
      this.form.numberType = "numeric";
      this.resultText = "";
    },
  },
};
</script>